<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="../static/static/css/font.css">
    <link rel="stylesheet" href="../static/static/css/weadmin.css">
    <script src="../static/lib/layui/layui.js" charset="utf-8"></script>
</head>
<body>
<div class="weadmin-body">
    <form class="layui-form" onsubmit="return false;">
        <div class="layui-row">
            <div class="layui-inline">
                <input class="layui-input" placeholder="名称" name="name" id="name">
            </div>
            <div class="layui-inline">
                <select id="type" name="type" lay-verify="required"  lay-filter="type">

                </select>
            </div>
            <div class="layui-inline">
                <select id="status" name="status" lay-verify="required">
                    <option value="">全部</option>
                    <option value="上架">上架</option>
                    <option value="下架">下架</option>
                </select>
            </div>
            <button class="layui-btn" onclick="reloadData()"><i class="layui-icon">&#xe615;</i></button>
            <button class="layui-btn" onclick="window.location.href='../templates/handleGoods1.html'"><i class="layui-icon"></i>新增
            </button>
        </div>
    </form>
    <table id="list" lay-filter="test"></table>
</div>
<script>
    var tableIns;
    layui.use(['jquery','table'], function () {
        var $ = layui.$;
        var form = layui.form;
        $.ajax({
            type: 'GET',
            url: '/goodsType/getTypeSelect',
            dataType: 'json',
            success: function(data){
                var typeList = data.data;
                var option1 = $("<option>").val(null).text("全部");
                $("#type").append(option1);
                for (var i=0;i<typeList.length;i++){
                    var option1 = $("<option>").val(typeList[i].id).text(typeList[i].name);
                    $("#type").append(option1);
                }
                form.render('select');
                $("#type").get(0).selectedIndex=0;
            }
        });
        //执行渲染
        tableIns = layui.table.render({
            elem: '#list'
            , id: 'list'
            , page: true
            , cols: [[ //表头
                {type: 'checkbox', fixed: 'left'}
                , {field: 'id', title: 'ID' ,width: 40}
                , {field: 'name', title: '名称'}
                , {field: 'typeName', title: '类别'}
                , {field: 'status', title: '状态',width: 80}
                , {field: 'code', title: '编号'}
                , {field: 'price', title: '一口价'}
                , {fixed: 'right', align: 'center', toolbar: '#bar'}
            ]]
            , toolbar: '#leftBar'
            , url: '/goods/getGoodsList'
            , method: 'post'
            , contentType: 'application/json'
            , parseData: function (res) { //res 即为原始返回的数据
                return {
                    "code": res.status, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.data.total, //解析数据长度
                    "data": res.data.infos //解析数据列表
                };
            }
        });

        layui.table.on('tool(test)', function (obj) {
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的DOM对象

            if (layEvent === 'detail') {
                window.location.href='../templates/goodsInfo.html?id='+data.id;
            } else if (layEvent === 'del') {
                layer.confirm('确认下架?', function (index) {
                    layer.close(index);
                    $.ajax({
                        type: "POST",
                        url: "/goods/updateGoodsStatus",
                        data: JSON.stringify({
                            id: data.id,
                            status: "下架"
                        }),
                        dataType: "json",
                        contentType: 'application/json',
                        success: function (data) {
                            if (data.status != 0) {
                                var layer = layui.layer;
                                layer.open({
                                    title: '提示'
                                    , content: data.msg
                                });
                            } else {
                                tableIns.reload({
                                    where: {
                                        name: document.getElementById("name").value,
                                        status: document.getElementById("status").value,
                                        typeId: document.getElementById("type").value
                                    }
                                    ,page: {
                                        curr: 1
                                    }
                                });
                            }
                        }
                    });
                });
            } else if (layEvent === 'edit') {

            }else if (layEvent === 'up') {
                layer.confirm('确认上架?', function (index) {
                    layer.close(index);
                    $.ajax({
                        type: "POST",
                        url: "/goods/updateGoodsStatus",
                        data: JSON.stringify({
                            id: data.id,
                            status: "上架"
                        }),
                        dataType: "json",
                        contentType: 'application/json',
                        success: function (data) {
                            if (data.status != 0) {
                                var layer = layui.layer;
                                layer.open({
                                    title: '提示'
                                    , content: data.msg
                                });
                            } else {
                                tableIns.reload({
                                    where: {
                                        name: document.getElementById("name").value,
                                        status: document.getElementById("status").value,
                                        typeId: document.getElementById("type").value
                                    }
                                    ,page: {
                                        curr: 1
                                    }
                                });
                            }
                        }
                    });
                });
            }
        });


    });

    var reloadData = function () {
        tableIns.reload({
            where: {
                name: document.getElementById("name").value,
                status: document.getElementById("status").value,
                typeId: document.getElementById("type").value
            }
            ,page: {
                curr: 1
            }
        });
    }
</script>
<script type="text/html" id="bar">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看详情</a>
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="up">上架</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">下架</a>
</script>
</body>
</html>